import React from 'react';
import { Row, Col, message } from 'antd';
import UserList from './list';
import services from '../../../../services/api/index';
import CommonListsIndex from '../../../../components/CommonLists/index';
import FilterTool from '../../../../components/FilterTool';

class PolicyVersionIndex extends CommonListsIndex {
  constructor(props) {
    super(props);
    this.addComponent = '';
    this.editComponent = '';
    this.listsComponent = UserList;
    this.model_width = 500;
    this.initQueryParams = {
      strategy_id: props.match.params.id,
    };
    this.queryParams = {
      ...this.initQueryParams,
    };
    this.queryPanigation = {
      current_page: 1,
      page_size: 10,
    };
  }
  componentDidMount() {}

  queryList(params) {
    services.strategyFlow.versions(params).then((res) => {
      if (res.code === 0) {
        const { list, totalCount } = res.data
        const currentPage = params.current_page
        const page = Math.ceil(totalCount / this.queryPanigation.page_size)
        if (list && totalCount && list.length === 0 && currentPage > page) {
          this.onChangePagination(page, 'current_page')
        } else {
          this.setState({
            ...res.data,
          });
        }
        // this.setState({
        //   ...res.data,
        // });
      } else {
        message.error(res.msg);
      }
    });
  }

  freshQueryList = () => {
    this.queryList({ ...this.queryPanigation, ...this.queryParams });
  };

  refreshPanagaition = (params) => {
    this.queryPanigation = {
      ...this.queryPanigation,
      ...params,
    };
  };
  refreshFilter = (params, type) => {
    this.queryParams = { ...this.initQueryParams, ...params };
    if (type === false) return
    this.freshQueryList();
  };

  render() {
    const ListsComponent = this.listsComponent;

    const data = [
      {
        type: 'rangepicker',
        key: 'start',
        name: ['start', 'end'],
        placeholder: ['开始时间', '结束时间'],
      },
      {
        type: 'Search',
        key: 'keyword',
        name: 'keyword',
        defaultValue: '',
        placeholder: '请输入版本号进行搜索',
      },
    ];
    return (
      <div>
        <Row type='flex' align='middle'>
          <Col span={24}>
            <FilterTool
              data={data}
              colNum={1}
              query={this.freshQueryList}
              refreshFilter={this.refreshFilter}
              isOnChange={true}
            />
          </Col>
        </Row>
        <div className='inner-content' style={{ marginTop: '10px' }}>
          <ListsComponent
            {...this.state}
            edit={this.edit}
            queryList={this.freshQueryList}
            onChangePagination={this.onChangePagination}
          />
        </div>
      </div>
    );
  }
}

export default PolicyVersionIndex;
